const params = {
    pagenum:1, // 页码值
    pagesize:2, // 每页显示多少条数据
    cate_id:'', // 文章分类的id，默认是空
    state:'' // 文章的状态
}

function render() {
     axios({
         method:'GET',
        url:'http://api-breakingnews-web.itheima.net/my/article/list',
        params,
        headers:{
            Authorization:localStorage.getItem('token')
          }
     }).then(({data:res})=>{
         if(res.status === 0){
             $('tbody').empty()
             res.data.forEach((obj)=>{
                let theTr = `<tr>
                <td>${obj.title}</td>
                <td>${obj.cate_name}</td>
                <td>${moment(obj.pub_date).format('YYYY-MM-DD hh:mm')}</td>
                <td>${obj.state}</td>
                <th>
                <button myid="${obj.Id}" type="button" class="layui-btn layui-btn-xs layui-btn-danger del">删除</button>
                    </th>
            </tr>`;
            $('tbody').append(theTr)
             })
             total = res.total
             setPage()
         }
     })
}

let total = 0
function setPage() {
    layui.use('laypage', function(){
        const laypage = layui.laypage;

        laypage.render({
            elem: 'page'
            ,count: total
            ,limit:params.pagesize
            ,limits:[2,3,5,10,20]
            ,curr:params.pagenum
            ,layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
            ,jump: function(obj, first){
                //obj包含了当前分页的所有参数，比如：
                console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                console.log(obj.limit); //得到每页显示的条数
                
                //首次不执行
                if(!first){
                  //do something
                  console.log('国共是一家');

                  params.pagenum = obj.curr
                  params.pagesize = obj.limit
                  console.log(params);
                  render() //重新渲染
                }
              }
          });
    })
}

//删除
$('tbody').on('click','.del',function () {
     const Id = $(this).attr('myid')
     layer.confirm('确定删除吗？', {icon: 3, title:'温馨提示'}, function(index){
        axios({
            method:'GET',
            url:`http://api-breakingnews-web.itheima.net/my/article/delete/${Id}`,
            headers:{ Authorization:localStorage.getItem('token')}
        }).then(({data:res})=>{
            console.log(res);
             layer.close(index);
             render()
        })        
       
      });
})

function getCates() {
    axios({
        method:'GET',
        url:'http://api-breakingnews-web.itheima.net/my/article/cates',
        headers:{
            Authorization:localStorage.getItem('token')
          }
    }).then(({data:res})=>{
        layer.msg(res.message)
        if(res.status === 0){
            $('select[name="category" ]').append( `<option value="" lay-verify="cate">请选择分类</option>`)
            res.data.forEach((obj)=>{
            const theOption = `<option value="${obj.Id}" lay-verify="cate">${obj.name}</option>`;
            $('select[name="category" ]').append(theOption)
            })
            layui.form.render('select','category')
            
        }
    })
}
getCates()

//渲染页面
render()

$('form').on('submit',function (e) {
     e.preventDefault()
const cate_id = $('select[name="cate_id" ]').val()
const state = $('select[name="state" ]').val()     

params.cate_id = cate_id
params.state = state

render()
})